function barEvt(yData, xData, ele, color, type) {
//	var triggerType=type==='bar'?'axis':''
var boundaryGap = type==='bar'?true:false
var axisPointerType = type==='bar'?'shadow':'line'
	var barOption = {
		color: color,
		tooltip: {
			trigger: 'axis',
			formatter: '{a}<br />{b} : {c}',
			axisPointer: {
				type: axisPointerType,
			},
			backgroundColor: 'rgba(9,89,124,0.8)',
			borderWidth: 1,
			borderColor: 'rgba(6,214,224,0.5)',
			textStyle: {
				color: '#4ff2f4'
			}
		},
		grid: {
			left: '3%',
			top: '10%',
			right: '5%',
			bottom: '2%',
			containLabel:true
		},
		xAxis: {
			type: 'category',
			boundaryGap: boundaryGap,
			splitLine: { //grid区域分隔线
				show: false,
				lineStyle: {
					width: 1,
					type: "solid",
					color: "#2a3f7e"
				}
			},
			axisLabel: { //坐标轴标签
				show: true,
				textStyle: {
					color: '#c0d4da'
				},
				interval: false,
				rotate: 25,
			},
			axisTick: {
				show: true, //刻度线
				color: "#c0d4da"
			},
			axisLine: {
				show: true, //坐标轴轴线
				lineStyle: {
					width: 1,
					color: "#c0d4da"
				}
			},
			data: yData
		},
		yAxis: {
			//name : '单位/万',
			splitLine: { //grid区域分隔线
				show: true,
				lineStyle: {
					width: 1,
					type: "solid",
					color: "#2a3f7e"
				}
			},
			axisTick: {
				show: true, //刻度线
				color: '#c0d4da'
			},
			axisLine: {
				show: true, //坐标轴轴线
				lineStyle: {
					width: 1,
					color: "#c0d4da"
				}
			},
			axisLabel: { //坐标轴标签
				show: true
			},
		},
		series: [{
			name: '网站数量',
			type: type,
			barGap: '-100%',
			barCategoryGap: '70%',
			data: xData,
			itemStyle: {
				normal: {
//					color: '#0ea4e3'
				}
			},
		}]
	};
	var barChart = echarts.init(document.getElementById(ele))
	barChart.setOption(barOption);
	window.addEventListener("resize", function() {
		barChart.resize();
	});
}

function dataLegend(data){
	var dataLe=[];
	for(var i=0;i<data.length;i++){
		dataLe.push(data[i].name)
	}
	return dataLe
}
var pieOptFn = function(data, ele, color){
  var pieOpt= {
  	color : color,
	  tooltip : {
	      trigger: 'item',
	      formatter: "{a} <br/>{b} : {c} ({d}%)"
	  },
	  legend: {
      show:true,
//	      orient: 'vertical',
      left: 'left',
      bottom: '2%',
      textStyle :{
      	color: '#fff'
      },
      data: dataLegend(data)
	  },
	  series : [
      {
        name: '',
        type: 'pie',
        radius : ['0%','60%'],
        center: ['50%', '45%'],
        data:data,
        itemStyle: {
            emphasis: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: 'rgba(0, 0, 0, 0.5)'
            }
        }
      }
	  ]
  }
	var pie1Chart = echarts.init(document.getElementById(ele));
	pie1Chart.setOption(pieOpt,true);
	window.addEventListener("resize", function() {
		pie1Chart.resize();
	});
	pie1Chart.on('click', function (params) {
		$('.map_open').show()
		$(".map_open").removeClass('zoomOut animated').addClass("zoomIn animated");
    console.log(params);
	});
	$(".close_win").click(function(){
		$(".map_open").fadeOut();
		$(".map_open").removeClass('zoomIn animated').addClass("zoomOut animated");
	})

	$(".map_shadow").click(function(){
		$(".map_open").fadeOut();
		$(".map_open").removeClass('zoomIn animated').addClass("zoomOut animated");
	})
};

function AutoScroll(obj) {
	$(obj).find("tr:first").animate({
		marginTop: "-27px"
	}, 500, function() {
		$(this).css({
			marginTop: "0px"
		}).appendTo(obj);
		$(obj).find("tr").removeClass('currentColor')
		console.log($(obj).find("tr").find('td').eq(1).html())
		$(obj).find("tr:first").addClass('currentColor')
		$(obj).animate({scrollTop: 0}, 100);
	});
}
var n=0;
function autoType(obj){
	AutoScroll(obj)
	n++
	if(n>$(obj).find('tr').length-1)n=0
//	console.log(n)
}
var timer=setInterval('autoType("#FontScroll")', 3000);

var thisTd=''
$("#FontScroll").find("tr").click(function(){
	thisTd=$(this).find('td').eq(1);
	console.log(thisTd.html())
})

$("#FontScroll").hover(function(){
	clearInterval(timer)
},function(){
	timer=setInterval('autoType("#FontScroll")', 3000);
})


var yDataDay = ['广东', '四川', '北京', '上海', '山东', '福建', '江苏', '浙江', '天津', '湖北']
var xDataDay = [745191, 468536, 437718, 412897, 390607, 365505, 188806, 169023, 164306, 126492]
var colorDay = '#0ea4e3'
barEvt(yDataDay, xDataDay, "euDay", colorDay, 'bar')

var yDataHour = ['广东', '四川', '北京', '上海', '山东', '福建', '江苏', '浙江', '天津', '湖北']
var xDataHour = [745191, 468536, 437718, 412897, 390607, 365505, 188806, 169023, 164306, 126492]
var colorHour = '#b6cc83'
barEvt(yDataHour, xDataHour, "euHour", colorHour, 'bar')

var yDataHour = ['广东', '四川', '北京', '上海', '山东', '福建', '江苏', '浙江', '天津', '湖北']
var xDataHour = [745191, 468536, 437718, 412897, 390607, 365505, 188806, 169023, 164306, 126492]
var colorShow = '#09e2cb'
barEvt(yDataHour, xDataHour, "barShow", colorShow, 'bar')

var yDataHour = ['广东', '四川', '北京', '上海', '山东', '福建', '江苏', '浙江', '天津', '湖北']
var xDataHour = [745191, 468536, 437718, 412897, 390607, 365505, 188806, 169023, 164306, 126492]
var colorMonitor = '#f46a17'
barEvt(yDataHour, xDataHour, "barMonitor", colorMonitor, 'bar')

var yDataLine = ['广东', '四川', '北京', '上海', '山东', '福建', '江苏', '浙江', '天津', '湖北']
var xDataLine = [745191, 468536, 437718, 412897, 390607, 365505, 188806, 169023, 164306, 126492]
var colorLine = '#f46a17'
barEvt(yDataLine, xDataLine, "pieLineDx", colorLine, 'line')

var pieData=[
	{value:62, name:'涉军类'},
	{value:40, name:'涉考类'},
  {value:91, name:'涉政类'},
  {value:35, name:'涉赌类'},
  {value:290, name:'色情类'}
]
var pieColor = ["#09a7e2","#b8ff2e","#09e24b","#09e2cb","#fce24f","#f46a17","#d40d03"]

pieOptFn(pieData, 'ecPie', pieColor)
